<template>
  <div class="container-content">
    <el-form
      ref="formRef"
      :model="formObject"
      label-width="100px"
      :rules="rules"
      status-icon
      label-position="left"
    >
      <el-collapse v-model="activeName" @change="handleClick">
        <el-collapse-item title="基本" name="basic">
          <el-row :gutter="15">
            <el-col :span="8">
              <el-form-item label="销售组织" prop="deptId">
                <el-input
                  v-model="formObject.deptId"
                  placeholder="请选择组织"
                  clearable
                  :style="{ width: '100%' }"
                  disabled
                >
                  <!-- <i
                                        slot="suffix"
                                        class="el-input__icon el-icon-notebook-2"
                                        style="cursor: pointer"
                                        @click="addDialog('dept')"
                                    ></i> -->
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="编号" prop="priceCode">
                <el-input
                  v-model="formObject.priceCode"
                  placeholder="保存时自动生成"
                  clearable
                  :style="{ width: '100%' }"
                >
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="价格类型" prop="priceType">
                <el-input
                  v-model="formObject.priceType"
                  placeholder="请选择价格类型"
                  clearable
                  :style="{ width: '100%' }"
                >
                  <i
                    slot="suffix"
                    class="el-input__icon el-icon-notebook-2"
                    style="cursor: pointer"
                    @click="addDialog('priceType')"
                  ></i>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="价目对象" prop="priceObject">
                <el-select
                  v-model="formObject.priceObject"
                  placeholder="请选择"
                  style="width: 100%"
                  @change="priceObejctChange"
                >
                  <el-option label="物料" value="1"></el-option>
                  <el-option label="物料分组" value="2"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="名称" prop="markedPriceName">
                <el-input
                  v-model="formObject.markedPriceName"
                  placeholder="请输入名称"
                  clearable
                  :style="{ width: '100%' }"
                >
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="限定客户" prop="restrictCustomer">
                <el-select
                  v-model="formObject.restrictCustomer"
                  placeholder="请选择"
                  style="width: 100%"
                  @change="restrictCustomerChange"
                >
                  <el-option label="客户" value="0"></el-option>
                  <el-option label="客户分组" value="1"></el-option>
                  <el-option label="客户类别" value="2"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="限定销售员" prop="restrictSale">
                <el-select
                  v-model="formObject.restrictSale"
                  placeholder="请选择"
                  style="width: 100%"
                  @change="restrictSaleChange"
                >
                  <el-option label="销售员" value="0"></el-option>
                  <el-option label="销售组" value="1"></el-option>
                  <el-option label="部门" value="2"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="生效日" prop="expirationDate">
                <el-date-picker
                  v-model="formObject.expirationDate"
                  format="yyyy-MM-dd"
                  value-format="yyyy-MM-dd"
                  :style="{ width: '100%' }"
                  placeholder="请输入日期"
                  clearable
                ></el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="失效日" prop="loseDate">
                <el-date-picker
                  v-model="formObject.loseDate"
                  format="yyyy-MM-dd"
                  value-format="yyyy-MM-dd"
                  :style="{ width: '100%' }"
                  placeholder="请输入日期"
                  clearable
                ></el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="币别" prop="currencyName">
                <el-input v-model="formObject.currencyName">
                  <i
                    slot="suffix"
                    class="el-input__icon el-icon-notebook-2"
                    style="cursor: pointer"
                    @click="addDialog('currency')"
                  ></i>
                </el-input>
              </el-form-item>
            </el-col>

            <el-col :span="8">
              <el-form-item label="整单状态" prop="state">
                <el-select
                  v-model="formObject.state"
                  placeholder="请选择"
                  style="width: 100%"
                  disabled
                >
                  <el-option label="暂存" value="0"></el-option>
                  <el-option label="未审核" value="1"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="是否含税" prop="includingTax">
                <el-radio v-model="formObject.includingTax" label="0" border
                  >否</el-radio
                >
                <el-radio v-model="formObject.includingTax" label="1" border
                  >是</el-radio
                >
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item
                label-width="210px"
                label="是否不参与严控价目表定价检查"
                prop="isStrictlyControl"
              >
                <el-radio
                  v-model="formObject.isStrictlyControl"
                  label="0"
                  border
                  >否</el-radio
                >
                <el-radio
                  v-model="formObject.isStrictlyControl"
                  label="1"
                  border
                  >是</el-radio
                >
              </el-form-item>
            </el-col>

            <el-col :span="24">
              <el-form-item label="备注" prop="remark">
                <el-input
                  v-model="formObject.remark"
                  placeholder="请输入备注"
                  clearable
                  type="textarea"
                  :style="{ width: '100%' }"
                >
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-collapse-item>
        <el-collapse-item
          title="客户"
          name="customer"
          v-if="formObject.restrictCustomer"
        >
          <el-button type="text" size="medium" @click="addNewRow('customer')"
            >新增行</el-button
          >
          <el-table
            :data="formObject.saleMarkedCustomerEntities"
            style="width: 100%"
            highlight-current-row
            border
          >
            <el-table-column label="操作" width="60">
              <template slot-scope="scope">
                <el-button
                  plain
                  icon="el-icon-minus"
                  size="mini"
                  @click="handleDataDelete(scope.$index, scope.row, 'customer')"
                ></el-button>
              </template>
            </el-table-column>
            <el-table-column
              type="index"
              label="序号"
              width="55"
              align="center"
            ></el-table-column>
            <el-table-column
              label="客户编码"
              prop="code"
              v-if="formObject.restrictCustomer == '0'"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.code">
                    <i
                      slot="suffix"
                      @click="addDialog('customer', scope.$index)"
                      class="el-input__icon el-icon-notebook-2"
                      style="cursor: pointer"
                    ></i>
                  </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="客户名称"
              prop="name"
              v-if="formObject.restrictCustomer == '0'"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.name" disabled> </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="客户分组"
              prop="code"
              v-if="formObject.restrictCustomer == '1'"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.code">
                    <i
                      slot="suffix"
                      @click="addDialog('customerGroup', scope.$index)"
                      class="el-input__icon el-icon-notebook-2"
                      style="cursor: pointer"
                    ></i>
                  </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="客户类别"
              prop="code"
              v-if="formObject.restrictCustomer == '2'"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.code">
                    <i
                      slot="suffix"
                      @click="addDialog('customerType', scope.$index)"
                      class="el-input__icon el-icon-notebook-2"
                      style="cursor: pointer"
                    ></i>
                  </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="客户类别名称"
              prop="name"
              v-if="formObject.restrictCustomer == '2'"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.name" disabled> </el-input>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column label="默认价目表" prop="isDefault" align="center">
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-checkbox
                    v-model="scope.row.isDefault"
                    true-label="1"
                    false-label="2"
                    :cheched="scope.row.isDefault == '1' ? true : false"
                  ></el-checkbox>
                </el-form-item>
              </template>
            </el-table-column>
          </el-table>
        </el-collapse-item>
        <el-collapse-item
          title="销售"
          name="sale"
          v-if="formObject.restrictSale"
        >
          <el-button type="text" size="medium" @click="addNewRow('sale')"
            >新增行</el-button
          >
          <el-table
            :data="formObject.saleMarkedSaleEntities"
            style="width: 100%"
            highlight-current-row
            border
          >
            <el-table-column label="操作" width="60">
              <template slot-scope="scope">
                <el-button
                  plain
                  icon="el-icon-minus"
                  size="mini"
                  @click="handleDataDelete(scope.$index, scope.row, 'sale')"
                ></el-button>
              </template>
            </el-table-column>
            <el-table-column
              type="index"
              label="序号"
              width="55"
              align="center"
            ></el-table-column>
            <el-table-column
              label="销售员编码"
              prop="code"
              v-if="formObject.restrictSale == '0'"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.code">
                    <i
                      slot="suffix"
                      @click="addDialog('saleId', scope.$index)"
                      class="el-input__icon el-icon-notebook-2"
                      style="cursor: pointer"
                    ></i>
                  </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="销售员名称"
              prop="name"
              v-if="formObject.restrictSale == '0'"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.name" disabled> </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="销售组名称"
              prop="name"
              v-if="formObject.restrictSale == '1'"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.name" disabled> </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="销售组编码"
              prop="code"
              v-if="formObject.restrictSale == '1'"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.code">
                    <i
                      slot="suffix"
                      @click="addDialog('saleGroup', scope.$index)"
                      class="el-input__icon el-icon-notebook-2"
                      style="cursor: pointer"
                    ></i>
                  </el-input>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column
              label="部门编码"
              prop="code"
              v-if="formObject.restrictSale == '2'"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.code">
                    <i
                      slot="suffix"
                      @click="addDialog('saleDept', scope.$index)"
                      class="el-input__icon el-icon-notebook-2"
                      style="cursor: pointer"
                    ></i>
                  </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="部门名称"
              prop="name"
              v-if="formObject.restrictSale == '2'"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.name" disabled> </el-input>
                </el-form-item>
              </template>
            </el-table-column>
          </el-table>
        </el-collapse-item>
        <el-collapse-item title="明细" name="detail">
          <el-button
            type="text"
            size="medium"
            @click="addNewRow('saleMakedDetailEntities')"
            >新增行</el-button
          >
          <el-table
            :data="formObject.saleMakedDetailEntities"
            style="width: 100%"
            highlight-current-row
            border
          >
            <el-table-column label="操作" width="60">
              <template slot-scope="scope">
                <el-button
                  plain
                  icon="el-icon-minus"
                  size="mini"
                  @click="
                    handleDataDelete(
                      scope.$index,
                      scope.row,
                      'materialDetailEntities'
                    )
                  "
                ></el-button>
              </template>
            </el-table-column>
            <el-table-column
              type="index"
              label="序号"
              width="55"
              align="center"
            ></el-table-column>
            <el-table-column
              width="120"
              :label="
                formObject.priceObject == '1' ? '物料编码' : '物料分组编码'
              "
              prop="code"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.code">
                    <i
                      v-if="formObject.priceObject == '1'"
                      slot="suffix"
                      @click="addDialog('material', scope.$index)"
                      class="el-input__icon el-icon-notebook-2"
                      style="cursor: pointer"
                    ></i>
                    <i
                      v-else
                      slot="suffix"
                      @click="addDialog('materialGrroup', scope.$index)"
                      class="el-input__icon el-icon-notebook-2"
                      style="cursor: pointer"
                    ></i>
                  </el-input>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column
              width="120"
              :label="
                formObject.priceObject == '1' ? '物料名称' : '物料分组名称'
              "
              prop="name"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.name" disabled></el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="规格型号"
              prop="model"
              v-if="formObject.priceObject == '1'"
            >
              <template slot-scope="scope">
                <el-form-item prop="model" label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.model" disabled></el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="BOM版本"
              prop="bomVersionName"
              width="150"
              v-if="formObject.priceObject == '1'"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.bomVersionName">
                    <i
                      slot="suffix"
                      @click="addDialog('bomVersion', scope.$index)"
                      class="el-input__icon el-icon-notebook-2"
                      style="cursor: pointer"
                    ></i
                  ></el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="批号"
              prop="batchNum"
              v-if="formObject.priceObject == '1'"
            >
              <template slot-scope="scope">
                <el-form-item
                  prop="batchNum"
                  label-width="0px"
                  style="margin: 0"
                >
                  <el-input v-model="scope.row.batchNum"></el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="" prop="pricingUnitName">
              <template slot="header">
                计价单位<span class="required">*</span>
              </template>
              <template slot-scope="scope">
                <el-form-item
                  label-width="0px"
                  style="margin: 0"
                  :rules="rules.pricingUnitName"
                  :prop="
                    'materialDetailEntities.' +
                    scope.$index +
                    '.pricingUnitName'
                  "
                >
                  <el-input v-model="scope.row.pricingUnitName">
                    <i
                      slot="suffix"
                      @click="addDialog('priceUnit', scope.$index)"
                      class="el-input__icon el-icon-notebook-2"
                      style="cursor: pointer"
                    ></i>
                  </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="价格系数" prop="minPrice">
              <template slot-scope="scope">
                <el-form-item
                  prop="minPrice"
                  label-width="0px"
                  style="margin: 0"
                >
                  <el-input v-model="scope.row.minPrice"> </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="最低价格" prop="startPrice">
              <template slot-scope="scope">
                <el-form-item
                  prop="startPrice"
                  label-width="0px"
                  style="margin: 0"
                >
                  <el-input v-model="scope.row.startPrice"> </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="最高价格" prop="endPrice">
              <template slot-scope="scope">
                <el-form-item
                  prop="endPrice"
                  label-width="0px"
                  style="margin: 0"
                >
                  <el-input v-model="scope.row.endPrice"> </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="批号" prop="batchNum">
              <template slot-scope="scope">
                <el-form-item
                  prop="batchNum"
                  label-width="0px"
                  style="margin: 0"
                >
                  <el-input v-model="scope.row.batchNum"></el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="生效日期" prop="expirationDate" width="120">
              <template slot-scope="scope">
                <el-form-item
                  prop="expirationDate"
                  label-width="0px"
                  style="margin: 0"
                >
                  <el-date-picker
                    v-model="scope.row.expirationDate"
                    format="yyyy-MM-dd"
                    value-format="yyyy-MM-dd"
                    :style="{ width: '100%' }"
                    placeholder="请输入日期"
                    clearable
                  ></el-date-picker>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="失效日期" prop="loseDate" width="120">
              <template slot-scope="scope">
                <el-form-item
                  prop="loseDate"
                  label-width="0px"
                  style="margin: 0"
                >
                  <el-date-picker
                    v-model="scope.row.loseDate"
                    format="yyyy-MM-dd"
                    value-format="yyyy-MM-dd"
                    :style="{ width: '100%' }"
                    placeholder="请输入日期"
                    clearable
                  ></el-date-picker>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="是否失效" prop="loseState" width="150">
              <template slot-scope="scope">
                <el-form-item
                  prop="loseState"
                  label-width="0px"
                  style="margin: 0"
                >
                  <el-radio v-model="scope.row.loseState" label="1"
                    >否</el-radio
                  >
                  <el-radio v-model="scope.row.loseState" label="2"
                    >是</el-radio
                  >
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="业务失效人" prop="losePerson" width="150">
              <template slot-scope="scope">
                <el-form-item
                  prop="losePerson"
                  label-width="0px"
                  style="margin: 0"
                >
                  <el-input v-model="scope.row.losePerson"></el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="业务失效日期"
              prop="businessLoseDate"
              width="150"
            >
              <template slot-scope="scope">
                <el-form-item
                  prop="businessLoseDate"
                  label-width="0px"
                  style="margin: 0"
                >
                  <el-date-picker
                    v-model="scope.row.businessLoseDate"
                    format="yyyy-MM-dd"
                    value-format="yyyy-MM-dd"
                    :style="{ width: '100%' }"
                    placeholder="请输入日期"
                    clearable
                  ></el-date-picker>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="行审核状态" prop="lineState" width="150">
              <template slot-scope="scope">
                <el-select
                  v-model="scope.row.lineState"
                  placeholder="请选择"
                  style="width: 100%"
                >
                  <el-option label="审核中" value="1"></el-option>
                  <el-option label="审核结束" value="2"></el-option>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column
              label="自定义基础资料1"
              prop="remarkOneName"
              width="150"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.remarkOneName">
                    <i
                      slot="suffix"
                      @click="addDialog('remarkOne', scope.$index)"
                      class="el-input__icon el-icon-notebook-2"
                      style="cursor: pointer"
                    ></i
                  ></el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="自定义基础资料2"
              prop="remarkTowName"
              width="150"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.remarkTowName">
                    <i
                      slot="suffix"
                      @click="addDialog('remarkTow', scope.$index)"
                      class="el-input__icon el-icon-notebook-2"
                      style="cursor: pointer"
                    ></i
                  ></el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="自定义辅助资料1"
              prop="remarkSup"
              width="150"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.remarkSup">
                    <i
                      slot="suffix"
                      @click="addDialog('remarkSup', scope.$index)"
                      class="el-input__icon el-icon-notebook-2"
                      style="cursor: pointer"
                    ></i
                  ></el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="自定义辅助资料2"
              prop="remarkSupTow"
              width="150"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.remarkSupTow">
                    <i
                      slot="suffix"
                      @click="addDialog('remarkSupTow', scope.$index)"
                      class="el-input__icon el-icon-notebook-2"
                      style="cursor: pointer"
                    ></i
                  ></el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="自定义文本1" prop="remarkTxt" width="150">
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.remarkTxt"> </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="自定义文本2"
              prop="remarkTxtTow"
              width="150"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.remarkTxtTow"> </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="自定义价格1" prop="remarkPrice" width="150">
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.remarkPrice"> </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="自定义价格2"
              prop="remarkPriceTow"
              width="150"
            >
              <template slot-scope="scope">
                <el-form-item label-width="0px" style="margin: 0">
                  <el-input v-model="scope.row.remarkPriceTow"> </el-input>
                </el-form-item>
              </template>
            </el-table-column>
          </el-table>
        </el-collapse-item>
      </el-collapse>
    </el-form>
    <el-dialog
      :title="dialogTitle"
      :visible.sync="dialog"
      append-to-body
      width="70%"
      destroy-on-close
      v-if="dialog"
    >
      <component
        :is="currentCom"
        :id="rowId"
        :visible.sync="dialog"
        @getSelectVal="getSelectVal"
      ></component>
      <span slot="footer" class="dialog-footer">
        <el-button @click="cancelSelect">取 消</el-button>
        <el-button type="primary" @click="confirmSelect">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import { listDept } from "@/api/system/dept";
import { getAreaList } from "@/api/area/area";
import { getOrderDetail, addList, getDocTypeList } from "@/api/system/purchase";
import { addPriceList } from "@/api/system/sale";
import { getCompute } from "@/api/finance/info";

import SaleId from "@/components/dialog/saleId";
import Customer from "@/components/dialog/customer";
import SaleDept from "@/components/dialog/saleDept";
import BusinessGroup from "@/components/dialog/businessGroup";
import QueryMaterialList from "@/components/dialog/queryMaterialList";
import PriceUnit from "@/components/dialog/priceUnit";
import TaxRate from "@/components/dialog/taxRate";
import Currency from "@/components/dialog/currency";
import BOM from "@/components/dialog/bom";
import Remark from "@/components/dialog/remark";

export default {
  props: ["rowId"],
  components: {
    SaleId,
    Customer,
    SaleDept,
    BusinessGroup,
    QueryMaterialList,
    PriceUnit,
    TaxRate,
    Currency,
    BOM,
    Remark,
  },
  data() {
    return {
      activeName: ["basic", "detail"],
      dialog: false,
      counties: [],
      orgData: [], //创建组织弹窗列表
      orgSelect: [], //选中项
      selectItem: [],
      orgTotal: "", //创建组织弹窗分页
      dialogType: "",
      dialogIndex: "",
      currentCom: "", //弹窗组件
      dialogTitle: "", //弹窗标题
      props: {},
      formObject: {
        businessType: "",
        createBy: "",
        createTime: "",
        currencyId: "",
        currencyName: "",
        deptId: "",
        expirationDate: "",
        id: "",
        includingTax: "",
        instanceId: "",
        isStrictlyControl: "",
        isUsed: "",
        loseDate: "",
        markedPriceName: "",
        modelId: "",
        pageNo: 0,
        pageSize: 0,
        params: {},
        priceCode: "",
        priceObject: "",
        priceType: "",
        remark: "",
        restrictCustomer: "",
        restrictSale: "",
        searchValue: "",
        state: "1",
        updateBy: "",
        updateTime: "",
        businessType: "7",
        modelId: this.$store.state.workflow.businessConfig.id,
        saleMakedDetailEntities: [],
        saleMarkedCustomerEntities: [],
        saleMarkedSaleEntities: [],
      },
      rules: {
        markedPriceName: [
          {
            required: true,
            message: "请输入价目名称",
            trigger: "blur",
          },
        ],
        currencyName: [
          {
            required: true,
            message: "请选择选择币别",
            trigger: "blur",
          },
        ],
        priceObject: [
          {
            required: true,
            message: "请选择价目对象",
            trigger: "change",
          },
        ],
      },
      documentTypeList: [],
    };
  },
  methods: {
    // 页签切换事件
    handleClick(tab, event) {},
    // 附件上传
    handleFileChange() {
      console.log("文件上传");
    },

    // 基础表单提交
    submit() {
      this.$refs["formRef"].validate((valid) => {
        if (!valid) return;
        // TODO 提交表单
        addPriceList(this.formObject).then((res) => {
          if (res.code === 200) {
            this.$message({
              message: "新增成功！",
              type: "success",
            });
            this.$store.commit("workflow/SET_BUSINESSDRAWER", false);
          }
        });
      });
    },

    // 基础表单取消
    formRest(formRef) {
      this.$refs[formRef].resetFields();
    },
    // 删除行
    handleDataDelete(index, row, type) {
      this.$confirm("请确认是否要删除此行？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.$message({
            type: "success",
            message: "删除成功!",
          });
          if (type === "materialDetailEntities") {
            // 物料明细
            this.formObject.saleMakedDetailEntities.splice(index, 1);
          } else if (type === "customer") {
            // 客户明细
            this.formObject.saleMarkedCustomerEntities.splice(index, 1);
          } else {
            // 销售明细
            this.formObject.saleMarkedSaleEntities.splice(index, 1);
          }
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },

    // 物料明细 添加行
    addMaterialDetailEntities(index, row) {
      // 物料明细 obj
      let materialObj = this.getDetialObj();
      materialObj.type = this.formObject.priceObject;
      this.formObject.saleMakedDetailEntities.push(materialObj);
    },
    // 客户明细 添加行
    addCustomerList() {
      let customerObj = this.getCustomerObj();
      this.formObject.saleMarkedCustomerEntities.push(customerObj);
    },
    // 销售明细 添加行
    addSaleList() {
      let saleObj = this.getSaleObj();
      this.formObject.saleMarkedSaleEntities.push(saleObj);
    },
    //添加新行
    addNewRow(type) {
      if (type === "saleMakedDetailEntities") {
        this.addMaterialDetailEntities(); //物料明细
      } else if (type === "customer") {
        this.addCustomerList(); //客户
      } else {
        this.addSaleList(); //销售
      }
    },
    // 价目对象
    priceObejctChange(value) {
      this.formObject.saleMakedDetailEntities.forEach((item) => {
        item.type = value;
      });
    },
    // 处理弹窗弹出
    handleOpen() {
      const nameMap = {
        customer: () => {
          this.dialogTitle = "选择客户";
          this.currentCom = Customer;
        },
        saleDept: () => {
          this.dialogTitle = "选择销售部门";
          this.currentCom = SaleDept;
        },
        saleId: () => {
          this.dialogTitle = "选择销售员";
          this.currentCom = SaleId;
        },
        saleGroup: () => {
          this.dialogTitle = "选择销售组";
          this.currentCom = BusinessGroup;
        },
        material: () => {
          this.dialogTitle = "选择物料";
          this.currentCom = QueryMaterialList;
        },
        unit: () => {
          this.dialogTitle = "选择单位";
          this.currentCom = PriceUnit;
        },
        priceUnit: () => {
          this.dialogTitle = "选择单位";
          this.currentCom = PriceUnit;
        },
        taxRate: () => {
          this.dialogTitle = "选择税率";
          this.currentCom = TaxRate;
        },
        currency: () => {
          this.dialogTitle = "选择币别";
          this.currentCom = Currency;
        },
        bomVersion: () => {
          this.dialogTitle = "选择物料清单";
          this.currentCom = BOM;
        },
        remarkOne: () => {
          this.dialogTitle = "选择仓库列表";
          this.currentCom = Remark;
        },
        remarkTow: () => {
          this.dialogTitle = "选择仓库列表";
          this.currentCom = Remark;
        },
      };
      nameMap[this.dialogType] ? nameMap[this.dialogType]() : "";
    },
    // 选择弹窗 item
    getSelectVal(val) {
      this.selectItem = val;
    },
    //点击选择dialog中的一条数据回显
    addDialog(type, index) {
      this.dialog = true;
      this.dialogType = type;
      this.dialogIndex = index;
      this.handleOpen();
    },

    // 创建组织
    selectOrg() {
      this.showOrg = true;
      let level = 1;
      listDept({ level }).then((res) => {
        if (res.code === 200) {
          this.orgData = res.data;
        }
        return;
      });
    },
    // 创建组织item
    selectOrgItem(val) {
      if (val.length === 1) {
        this.orgSelect = val;
        this.showOrg = false;
      }
    },
    //获取单据类型
    getDocTypeListApi() {
      getDocTypeList({ docCode: "SAL_QUOTATION" }).then((res) => {
        if (res.code === 200) {
          this.documentTypeList = res.rows;
        }
      });
    },
    //下拉类型选择
    handleCommand(val) {
      this.dialogType = val;
      this.dialog = true;
      this.handleOpen();
    },
    restrictCustomerChange(value) {
      if (value) {
        this.activeName.push("customer");
      }
      this.formObject.saleMarkedCustomerEntities.forEach((item) => {
        Object.keys(item).forEach((key) => {
          item[key] = "";
        });
      });
    },
    restrictSaleChange(value) {
      if (value) {
        this.activeName.push("sale");
      }
      this.formObject.saleMarkedSaleEntities.forEach((item) => {
        Object.keys(item).forEach((key) => {
          item[key] = "";
        });
      });
    },
    // 取消
    cancelSelect() {
      this.dialog = false;
      this.selectItem = [];
      this.currentCom = "";
    },
    // 确认
    confirmSelect() {
      const nameMap = {
        customer: () => {
          if (this.selectItem.length !== 1) {
            this.$message.error("请选择一条数据！");
            return;
          }
          this.formObject.saleMarkedCustomerEntities[this.dialogIndex].code =
            this.selectItem[0].id;
          this.formObject.saleMarkedCustomerEntities[this.dialogIndex].name =
            this.selectItem[0].customerName;
          this.dialog = false;
        },

        saleDept: () => {
          if (this.selectItem.length !== 1) {
            this.$message.error("请选择一条数据！");
            return;
          }
          this.formObject.saleMarkedSaleEntities[this.dialogIndex].code =
            this.selectItem[0].deptId;
          this.formObject.saleMarkedSaleEntities[this.dialogIndex].name =
            this.selectItem[0].deptName;
          this.dialog = false;
        },
        saleId: () => {
          if (this.selectItem.length !== 1) {
            this.$message.error("请选择一条数据！");
            return;
          }
          this.formObject.saleMarkedSaleEntities[this.dialogIndex].code =
            this.selectItem[0].userId;
          this.formObject.saleMarkedSaleEntities[this.dialogIndex].name =
            this.selectItem[0].userName;
          this.dialog = false;
        },
        saleGroup: () => {
          if (this.selectItem.length !== 1) {
            this.$message.error("请选择一条数据！");
            return;
          }
          this.formObject.saleMarkedSaleEntities[this.dialogIndex].code =
            this.selectItem[0].id;
          this.formObject.saleMarkedSaleEntities[this.dialogIndex].name =
            this.selectItem[0].businessGroupType;
          this.dialog = false;
        },
        material: () => {
          if (this.selectItem.length !== 1) {
            this.$message.error("请选择一条数据！");
            return;
          }
          this.selectItem.forEach((item) => {
            let materialObj = this.getDetialObj();
            Object.keys(item).forEach((itemKey) => {
              Object.keys(materialObj).forEach((materialKey) => {
                if (itemKey === materialKey) {
                  materialObj[materialKey] = item[itemKey];
                }
                if (itemKey === "id") {
                  materialObj["id"] = "";
                }
                if (itemKey === "materialCode") {
                  materialObj["code"] = item[itemKey];
                }
                if (itemKey === "materialName") {
                  materialObj["name"] = item[itemKey];
                }
              });
            });
            this.$set(
              this.formObject.saleMakedDetailEntities,
              this.dialogIndex,
              materialObj
            );
          });
          this.dialog = false;
        },
        unit: () => {
          if (this.selectItem.length !== 1) {
            this.$message.error("请选择一条记录！");
            return;
          }

          // 销售单位 purchaseUnit
          this.formObject.materialDetailEntities[
            this.dialogIndex
          ].purchaseUnit = this.selectItem[0].meteringUnitCode;
          this.formObject.materialDetailEntities[
            this.dialogIndex
          ].purchaseUnitName = this.selectItem[0].meteringUnitName;
          this.dialog = false;
        },
        priceUnit: () => {
          if (this.selectItem.length !== 1) {
            this.$message.error("请选择一条记录！");
            return;
          }
          // 计价单位
          this.formObject.saleMakedDetailEntities[
            this.dialogIndex
          ].pricingUnit = this.selectItem[0].meteringUnitCode;
          this.formObject.saleMakedDetailEntities[
            this.dialogIndex
          ].pricingUnitName = this.selectItem[0].meteringUnitName;
          this.dialog = false;
        },
        taxRate: () => {
          if (this.selectItem.length !== 1) {
            this.$message.error("请选择一条记录！");
            return;
          }
          // 税率
          this.formObject.materialDetailEntities[this.dialogIndex].taxRate =
            this.selectItem[0].rate;
          this.caculateNum(
            this.formObject.materialDetailEntities[this.dialogIndex],
            this.dialogIndex
          );
          this.dialog = false;
        },
        currency: () => {
          if (this.selectItem.length !== 1) {
            this.$message.error("请选择一条记录！");
            return;
          }
          this.formObject.currencyId = this.selectItem[0].id;
          this.formObject.currencyName = this.selectItem[0].currencyName;

          this.dialog = false;
        },
        bomVersion: () => {
          if (this.selectItem.length !== 1) {
            this.$message.error("请选择一条记录！");
            return;
          }
          this.formObject.saleMakedDetailEntities[this.dialogIndex].bomVersion =
            this.selectItem[0].id;
          this.formObject.saleMakedDetailEntities[
            this.dialogIndex
          ].bomVersionName = this.selectItem[0].bomVersion;
          this.dialog = false;
        },
        remarkOne: () => {
          if (this.selectItem.length !== 1) {
            this.$message.error("请选择一条记录！");
            return;
          }
          this.formObject.saleMakedDetailEntities[this.dialogIndex].remarkOne =
            this.selectItem[0].wareCode;
          this.formObject.saleMakedDetailEntities[
            this.dialogIndex
          ].remarkOneName = this.selectItem[0].wareName;
          this.dialog = false;
        },
        remarkTow: () => {
          if (this.selectItem.length !== 1) {
            this.$message.error("请选择一条记录！");
            return;
          }
          this.formObject.saleMakedDetailEntities[this.dialogIndex].remarkTow =
            this.selectItem[0].wareCode;
          this.formObject.saleMakedDetailEntities[
            this.dialogIndex
          ].remarkTowName = this.selectItem[0].wareName;
          this.dialog = false;
        },
      };
      nameMap[this.dialogType] ? nameMap[this.dialogType]() : "";
    },
    getDetialObj() {
      return {
        batchNum: "",
        bomVersion: "",
        bomVersionName: "",
        businessLoseDate: "",
        businessType: "",
        code: "",
        createBy: "",
        createTime: "",
        endNum: "",
        endPrice: "",
        expirationDate: "",
        id: "",
        instanceId: "",
        isUsed: "",
        lineState: "",
        loseDate: "",
        losePerson: "",
        loseState: "",
        markedPriceId: "",
        minPrice: "",
        model: "",
        modelId: "",
        name: "",
        pageNo: 0,
        pageSize: 0,
        params: {},
        pricingUnit: "",
        pricingUnitName: "",
        remark: "",
        remarkOne: "",
        remarkOneName: "",
        remarkPrice: "",
        remarkPriceTow: "",
        remarkSup: "",
        remarkSupTow: "",
        remarkTow: "",
        remarkTowName: "",
        remarkTxt: "",
        remarkTxtTow: "",
        searchValue: "",
        startNum: "",
        startPrice: "",
        type: "", //1按物料2按物料分组
        updateBy: "",
        updateTime: "",
      };
    },
    getCustomerObj() {
      return {
        code: "",
        createBy: "",
        createTime: "",
        id: "",
        isDefault: "",
        isUsed: "",
        markedPriceId: "",
        name: "",
        pageNo: 0,
        pageSize: 0,
        params: {},
        remark: "",
        searchValue: "",
        type: "1",
        updateBy: "",
        updateTime: "",
      };
    },
    getSaleObj() {
      return {
        code: "",
        createBy: "",
        createTime: "",
        id: "",
        isDefault: "",
        isUsed: "",
        markedPriceId: "",
        name: "",
        pageNo: 0,
        pageSize: 0,
        params: {},
        remark: "",
        searchValue: "",
        type: "2",
        updateBy: "",
        updateTime: "",
      };
    },
    // 计算值
    caculateNum(row, index) {
      // 数量，税率，价税合计，汇率
      console.log("触发", row);
      if (row == undefined) {
        return;
      }
      if (
        row.number &&
        row.taxRate &&
        row.totalTaxPrice &&
        this.formObject.rate
      ) {
        let totalTaxAmount = row.totalTaxPrice;
        let number = row.number;
        let taxRate = row.taxRate;
        let rate = this.formObject.rate;
        getCompute({ number, taxRate, totalTaxAmount, rate }).then((res) => {
          this.$set(
            this.formObject.materialDetailEntities[index],
            "price",
            res.data.price
          );
          this.$set(
            this.formObject.materialDetailEntities[index],
            "amountMoney",
            res.data.amount
          );

          this.$set(
            this.formObject.materialDetailEntities[index],
            "taxAmount",
            res.data.taxAmount
          );

          this.$set(
            this.formObject.materialDetailEntities[index],
            "taxPrice",
            res.data.taxUnitPrice
          );
        });
      }
    },
    // getSummaries(param) {
    //     const { columns, data } = param;
    //     const sums = [];
    //     columns.forEach((column, index) => {
    //         if (index === 0) {
    //             sums[index] = "总计";
    //             return;
    //         }
    //         if (
    //             column.property === "number" ||
    //             column.property === "pricingNum" ||
    //             column.property === "amountMoney" ||
    //             column.property === "taxAmount" ||
    //             column.property === "totalTaxPrice"
    //         ) {
    //             const values = data.map((item) =>
    //                 Number(item[column.property])
    //             );
    //             if (!values.every((value) => isNaN(value))) {
    //                 sums[index] = values.reduce((prev, curr) => {
    //                     const value = Number(curr);
    //                     if (!isNaN(value)) {
    //                         return prev + curr;
    //                     } else {
    //                         return prev;
    //                     }
    //                 }, 0);
    //                 sums[index] += "";
    //             } else {
    //                 sums[index] = "N/A";
    //             }
    //         } else {
    //             return;
    //         }
    //     });

    //     return sums;
    // },
  },
  created() {
    this.getDocTypeListApi();
  },
};
</script>
<style lang="scss" scoped>
// .add {
//   padding: 15px;
// }
.panel-title {
  font-size: 18px;
  color: #37474f;
  font-weight: 500;
  text-shadow: rgba(0, 0, 0, 0.15) 0 0 1px;
}

::v-deep .el-form-item__content {
  margin-left: 0;
}

.main-responsible {
  font-size: 14px;
  font-weight: 550;
  color: #263238;
  position: relative;
  text-indent: 15px;
}
::v-deep .el-table td.el-table__cell div {
  overflow: visible;
}

::v-deep .el-table td.el-table__cell {
  padding-bottom: 20px;
}
</style>
